<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title></title>
    <link rel="stylesheet" href="css/reset.css" />
    <link rel="stylesheet" href="css/all.css" />
    <script src="js/jquery-1.7.1.min.js"></script>
    <script src="js/jquery.touchSlider.js"></script>
    <script src="js/self.js"></script>
    <script>
        $(function () {
            //            进度条
            $(".bar_span").each(function () {
                var ress = $(this).attr('width');
                var len=ress+"%";
                console.log(len);
                $(this).animate({
                    width:len
                });

            })

        })
    </script>
</head>
<body  ontouchstart="">
    <div class="searchTop pf w100 of">
        <div class="of clearfix">
            <span class="fl" onclick="javascript:history.back();"><</span>
            <form class="fr pr db" style="width: 85%">
                <input type="submit" value="" name="" class="magnifyingGlass pa">
                <input type="search" name="" value="" id="searchInput" placeholder="搜索"/>
            </form>
        </div>
    </div>
    <div class="kindNav fl">
        <div class="w100">
            <a href="#">全部</a>
            <a href="#">科技</a>
            <a href="#">健康</a>
            <a href="#">家电</a>
            <a href="#">设计</a>
            <a href="#">娱乐</a>
            <a href="#">出版</a>
            <a href="#">公益</a>
            <a href="#">其他</a>
        </div>
    </div>
    <script type="text/javascript">
//        内容列表瀑布流加载
        $(function(){

            $(window).bind('scroll',function(){show()});

            function show()

            {

                if($(window).scrollTop()+$(window).height()>=$(document).height())

                {

                    ajaxRead();

                }

            }

            function ajaxRead()

            {

                var html="";

                $.ajax({

                    type:'get',

                    dataType:'jsonp',

                    url:'',

                    beforeSend:function(){
                        console.log('loading...')
                        $("#loading").show();
                    },

                    success:function(data){

                        $.each(data.items,function(i,item){
                            html = '' +
                            '<section class="proSection pr w100 bcf">'+
                                '<div class="proTittle pa w100">'+
                                    '<div class="of clearfix w100">'+
                                    '<span class="fl">众筹中</span>'+
                                    '<a href="#" class="fr">科技</a>'+
                                    '</div>'+
                                '</div>'+
                                '<a href="#" class="KindImg db w100 of">'+
                                     '<img src="images/watch.png" class="db w100 h100">'+
                                 '</a>'+
                                '<a class="kindName db of clearfix">'+
                                    '<span class="fl">项目名称aa更多新...</span>'+
                                    '<i class="fr">发布众筹公司名称</i>'+
                                '</a>'+
                                '<a class="KindMoney db of clearfix">'+
                                    '<span class="fl">￥296.00</span>'+
                                    '<i class="fr">89.9 %</i>'+
                                '</a>'+
                                '<a class="progress db" style="margin: 0 5px 5px;"><img src="images/progressbar.png" class="bar_span" width="89.9"> </img></a>'+
                                '<a class="kindDetail db of clearfix">'+
                                    '<div class="fl tl" style="width: 45%;margin-left: 2%;">'+
                                        '<span class="db f12">￥20000000.00</span>'+
                                        '<i class="db f10">目标</i>'+
                                    '</div>'+
                                    '<div class="fl tl" style="width: 35%">'+
                                        '<span class="db f12">￥17999990.00</span>'+
                                        '<i class="db f10">已筹</i>'+
                                    '</div>'+
                                '<div class="fl tc" style="width: 20%">'+
                                    '<span class="db f12">19&nbsp;天</span>'+
                                    '<i class="db f10">剩余</i>'+
                                '</div>'+
                                '</a>'+
                            '</section>'+
                            '';
                        });
                        $("#loading").hide();
                        $("#resText").before($(html));

                    },

                    complete:function(){console.log('mission acomplete.')}

                });

            }

        })

    </script>
    <div class="container jz">
        <div class="w100 of clearfix">
            <div class="kindContent fr">
                <section class="proSection pr w100 bcf">
    <div class="proTittle pa w100">
        <div class="of clearfix w100">
            <span class="fl">众筹中</span>
            <a href="#" class="fr">科技</a>
        </div>
    </div>
    <a href="#" class="KindImg db w100 of">
        <img src="images/watch.png" class="db w100 h100">
    </a>
    <a class="kindName db of clearfix">
        <span class="fl">项目名称...</span>
        <i class="fr">发布众筹公司名称</i>
    </a>
    <a class="KindMoney db of clearfix">
        <span class="fl">￥296.00</span>
        <i class="fr">89.9 %</i>
    </a>
    <a class="progress db" style="margin: 0 5px 5px;"><div class="bar_span" width="89.9"></div></a>
    <a class="kindDetail db of clearfix">
        <div class="fl tl" style="width: 45%">
            <span class="db f12">￥20000000.00</span>
            <i class="db f10">目标</i>
        </div>
        <div class="fl tl" style="width: 35%">
            <span class="db f12">￥17999990.00</span>
            <i class="db f10">已筹</i>
        </div>
        <div class="fl tc" style="width: 20%">
            <span class="db f12">19&nbsp;天</span>
            <i class="db f10">剩余</i>
        </div>
    </a>
</section>
                <section class="proSection pr w100 bcf">
                    <div class="proTittle pa w100">
                        <div class="of clearfix w100">
                            <span class="fl">众筹中</span>
                            <a href="#" class="fr">科技</a>
                        </div>
                    </div>
                    <a href="#" class="KindImg db w100 of">
                        <img src="images/watch.png" class="db w100 h100">
                    </a>
                    <a class="kindName db of clearfix">
                        <span class="fl">项目名称...</span>
                        <i class="fr">发布众筹公司名称</i>
                    </a>
                    <a class="KindMoney db of clearfix">
                        <span class="fl">￥296.00</span>
                        <i class="fr">24.5 %</i>
                    </a>
                    <a class="progress db" style="margin: 0 5px 5px;"><div class="bar_span" width="24.5"></div></a>
                    <a class="kindDetail db of clearfix">
                        <div class="fl tl" style="width: 45%">
                            <span class="db f12">￥20000000.00</span>
                            <i class="db f10">目标</i>
                        </div>
                        <div class="fl tl" style="width: 35%">
                            <span class="db f12">￥17999990.00</span>
                            <i class="db f10">已筹</i>
                        </div>
                        <div class="fl tc" style="width: 20%">
                            <span class="db f12">19&nbsp;天</span>
                            <i class="db f10">剩余</i>
                        </div>
                    </a>
                </section>
                <section class="proSection pr w100 bcf">
                    <div class="proTittle pa w100">
                        <div class="of clearfix w100">
                            <span class="fl">众筹中</span>
                            <a href="#" class="fr">科技</a>
                        </div>
                    </div>
                    <a href="#" class="KindImg db w100 of">
                        <img src="images/watch.png" class="db w100 h100">
                    </a>
                    <a class="kindName db of clearfix">
                        <span class="fl">项目名称...</span>
                        <i class="fr">发布众筹公司名称</i>
                    </a>
                    <a class="KindMoney db of clearfix">
                        <span class="fl">￥296.00</span>
                        <i class="fr">89.9 %</i>
                    </a>
                    <a class="progress db" style="margin: 0 5px 5px;"><div class="bar_span" width="89.9"></div></a>
                    <a class="kindDetail db of clearfix">
                        <div class="fl tl" style="width: 45%">
                            <span class="db f12">￥20000000.00</span>
                            <i class="db f10">目标</i>
                        </div>
                        <div class="fl tl" style="width: 35%">
                            <span class="db f12">￥17999990.00</span>
                            <i class="db f10">已筹</i>
                        </div>
                        <div class="fl tc" style="width: 20%">
                            <span class="db f12">19&nbsp;天</span>
                            <i class="db f10">剩余</i>
                        </div>
                    </a>
                </section>
                <div id="resText"></div><!--resText-->
                <div id="loading" class="w100">
                    <img src="images/loading.gif" alt="正在加载" class="db jz hauto" style="width: 15px;">
                    <div class="w100 tc f10 c9">正在加载</div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>